import React from 'react';
import { datetime, millisecond } from '../../../../../common/formatter';
import cn from 'classnames'
import s from './style.module.css'
import Icon from '@knownsec/react-component/dist/Icon'
import Tooltip from '@knownsec/react-component/dist/Tooltip';
import ms from 'ms';
const portState = ['开启', '未知', '关闭'];
const monitorLabel = { hostVul: '主机监测' };
export const jobCol = [
	{
		title: '关联资产',
		dataIndex: 'subdomain',
		key: 'subdomain',
	},
	{
		title: 'IP地址',
		dataIndex: 'ip',
		key: 'ip',
		render (e) {
			return e || '- -'
		}
	},
	{
		title: '接入情况',
		dataIndex: 'accessed',
		key: 'accessed',
		render (e) {
			return e ? '已接入' : '未接入'
		}
	},
	{
		title: '操作',
		dataIndex: 'method',
		key: 'method'
	}
]
export const httpMap = {
	HEAD: 'HEAD方法与GET方法的行为类似，但服务器在响应中只返回首部。不会返回请求主体部分。这就允许客户端在未获取实际资源的情况下，对资源的首部进行检查。也被认为是安全的方法。',
	TRACE: '服务端发起一个请求时，这个请求可能要穿过防火墙，代理，网关或其他一些应用程序。每个中间节点都可能会修改原始的HTTP请求。TRACE方法允许客户端在最终将请求发送给服务器时，获得请求的最终形态。',
	GET: 'GET是最常用的HTTP请求方法。通常用于请求服务器获取某个资源，被认为是安全的方法。',
	PUT: '与GET从服务器读取文档相反，PUT方法会向服务器写入文件。PUT方法的语义就是让服务器用请求的主体来创建一个由请求的URL命名的新文档。',
	POST: 'POST方法起初是用来向服务器输入数据的。实际上，通常会用它来支持HTML的表单。表单中填好的数据会被POST方法提交到服务器中并做进一步处理。',
	OPTIONS: 'OPTIONS方法请求Web服务器告知其支持的各种功能。可以询问服务器通常支持哪些方法，或者对某些特殊资源支持哪些方法。该方法能够让客户端不用实际访问那些资源就能判定访问各种资源的最优方式。',
	DELETE: 'DELETE方法能够请求服务器删除请求URL所指定的资源。'
}
const httpSafeIcon = <svg style={{verticalAlign: 'middle', marginRight: '5px', position: 'relative', top: '-1px'}} xmlns="http://www.w3.org/2000/svg" class="icon" width="16px" height="16px" viewBox="0 0 1024 1024" version="1.1"><path fill="#52c41a" d="M866.9 169.9L527.1 54.1C523 52.7 517.5 52 512 52s-11 0.7-15.1 2.1L157.1 169.9c-8.3 2.8-15.1 12.4-15.1 21.2v482.4c0 8.8 5.7 20.4 12.6 25.9L499.3 968c3.5 2.7 8 4.1 12.6 4.1s9.2-1.4 12.6-4.1l344.7-268.6c6.9-5.4 12.6-17 12.6-25.9V191.1c0.2-8.8-6.6-18.3-14.9-21.2zM810 654.3L512 886.5 214 654.3V226.7l298-101.6 298 101.6v427.6zM404.2 453.3c-3-4.1-7.8-6.6-13-6.6H336c-6.5 0-10.3 7.4-6.5 12.7l126.4 174c6.4 8.8 19.6 8.8 26 0l212.6-292.7c3.8-5.3 0-12.7-6.5-12.7h-55.2c-5.1 0-10 2.5-13 6.6L468.9 542.4l-64.7-89.1z"/></svg>
const httpErrorIcon = <svg style={{verticalAlign: 'middle', marginRight: '5px', position: 'relative', top: '-1px'}} width="13px" height="15px" viewBox="0 0 16 18" version="1.1">
<defs>
		<filter id="filter-1">
				<feColorMatrix in="SourceGraphic" type="matrix" values="0 0 0 0 0.733333 0 0 0 0 0.031373 0 0 0 0 0.027451 0 0 0 1.000000 0"/>
		</filter>
</defs>
<g id="页面-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
		<g id="画板" transform="translate(-473.000000, -784.000000)">
				<g id="icon/bug备份-4" transform="translate(469.000000, 781.000000)" filter="url(#filter-1)">
						<g id="分组-31">
								<path d="M12.7138991,3.17559818 C13.7484151,3.7256968 14.7604496,4.10192803 15.7500025,4.30429187 C16.4699031,4.45151175 17.2017023,4.51157751 17.9454,4.48448916 C18.7732796,4.45433173 19.4688539,5.10101571 19.4990085,5.92889542 C19.4996711,5.94708778 19.5,5.9652907 19.5,5.98349512 L19.5,12.1207056 C19.5,14.8341751 18.0765503,17.3487523 15.7500025,18.7452093 L12.7719609,20.5327105 C12.2968307,20.8178965 11.7031742,20.8178965 11.2280441,20.5327105 L8.25000249,18.7452093 C5.92345469,17.3487523 4.5,14.8341751 4.5,12.1207056 L4.5,5.99533948 C4.5,5.16691098 5.17157399,4.49533699 6,4.49533699 C6.01685409,4.49533699 6.03370449,4.49562096 6.05054651,4.49618879 C6.77228116,4.52052215 7.50543315,4.45655651 8.25000249,4.30429187 C9.28759463,4.09210399 10.3030146,3.71751031 11.2962624,3.18051085 C11.7381697,2.94158071 12.2703444,2.93974029 12.7138991,3.17559818 Z M12.0096551,4.50000012 C10.8889314,5.1059266 9.73478325,5.53169782 8.55053313,5.7738773 C7.69195656,5.94945645 6.84107388,6.02369379 6.00000249,5.99533699 L6.00000249,12.1207056 C6.00000249,14.3073701 7.14709937,16.3337561 9.02196086,17.4590988 L12.0000025,19.2466 L14.9780441,17.4590988 C16.8529056,16.3337561 18.0000025,14.3073701 18.0000025,12.1207056 L18.0000025,5.98349512 C17.1375565,6.01490865 16.2865368,5.94505732 15.4494719,5.7738773 C14.3134225,5.54155488 13.1666976,5.11525153 12.0096551,4.50000012 Z M13.5288736,6.70675729 L12.40214,10.9117842 L15.2764098,10.9117842 L10.8876541,16.5639227 L12.0583799,12.1947145 L8.78863016,12.1947145 L13.5288736,6.70675729 Z" id="合并形状" fill="#FF0000"/>
								<rect id="矩形-copy-55" x="0" y="0" width="16" height="16"/>
						</g>
				</g>
		</g>
</g>
</svg>
export const httpCol = [
	{
		title: '监控类型',
		dataIndex: 'type',
		key: 'type'
	},
	{
		title: '状态',
		dataIndex: 'status',
		key: 'status',
		render (e, row) {
			return (
				<div>
					{row.isSafe ? httpSafeIcon : httpErrorIcon}
					<span>{row.isSafe ? '' : '不'}安全</span>
					<span>（{row.isClose ? '已关闭' : '已开启'}）</span>
				</div>
			)
		}
	},
	{
		title: '说明',
		dataIndex: 'detail',
		key: 'detail',
		width: 500,
		render (e, row) {
			return (
				<Tooltip overlay={<div className={s.w300}>{httpMap[row.type]}</div>} placement='top'>
					<div className={cn(s.ell)}>{httpMap[row.type]}</div>
				</Tooltip>
			)
		}
	}
]
export const portCol = [
	{
		title: '端口',
		dataIndex: 'port',
		key: 'port',
	},
	{
		title: '服务名称',
		dataIndex: 'name',
		key: 'name',
	},
	{
		title: '状态',
		dataIndex: 'port_state',
		key: 'port_state',
		render(e) {
			return <span>{portState[e]}</span>;
		},
	},
];
export const osCol = [
	{
		title: '名称',
		dataIndex: 'osfamily',
		key: 'osfamily',
		render(e) {
			return e || '- -';
		},
	},

	{
		title: '版本',
		dataIndex: 'osgen',
		key: 'osgen',
		render(e) {
			return e || '- -';
		},
	},
	{
		title: '全名',
		dataIndex: 'name',
		key: 'name',
		render(e) {
			return e || '- -';
		},
	},
	{
		title: 'CPE',
		dataIndex: 'cpe',
		key: 'cpe',
		render(e) {
			return e || '- -';
		},
	},
	// {
	// 	title: '主机名',
	// 	dataIndex: 'hostname',
	// 	key: 'hostname',
	// },
];
export const webCol = [
	{
		title: '名称',
		dataIndex: 'name',
		key: 'name',
	},
	{
		title: '版本',
		dataIndex: 'version',
		key: 'version',
	}
];
export const webTaskCol = [
	{
		title: '检测项',
		dataIndex: 'task_type',
		key: 'task_type',
		width: 200,
		render(e) {
			return monitorLabel[e] || e;
		},
	},
	{
		title: '检测开始时间',
		dataIndex: 'start_time',
		key: 'start_time',
		width: 200,
		render(e) {
			return datetime(e) || e;
		},
	},
	{
		title: '检测结束时间',
		dataIndex: 'end_time',
		key: 'end_time',
		width: 200,
		render(e) {
			return datetime(e) || e;
		},
	},
	{
		title: '检测耗时',
		dataIndex: 'used_time',
		key: 'used_time',
		width: 80,
		render(e) {
			return e;
		},
	},
	{
		title: '任务ID',
		dataIndex: 'task_session_id',
		key: 'task_session_id',
	},
];
export const portRemoveCol = (num) => {return [
	{
		title: `端口关闭(${num})`,
		dataIndex: 'affects',
		key: 'affects'
	},
	{
		title: '状态',
		dataIndex: 'isResolved',
		key: 'isResolved',
		filters: [
      {
        text: '已确认',
        value: true,
      },
      {
        text: '待确认',
        value: false,
      },
    ],
		filterMultiple: false,
		filterIcon: <Icon type='down' />,
    onFilter: (value, record) => record.isResolved === value,
		render (e, row) {
			return row.isResolvedIcon
		}
	},
]}
export const portAddCol = (num) => { return [
	{
		title: `端口开放(${num})`,
		dataIndex: 'affects',
		key: 'affects'
	},
	{
		title: '状态',
		dataIndex: 'isResolved',
		key: 'isResolved',
		filters: [
      {
        text: '已确认',
        value: true,
      },
      {
        text: '待确认',
        value: false,
      },
    ],
		filterMultiple: false,
		filterIcon: <Icon type='down' />,
    onFilter: (value, record) => record.isResolved === value,
		render (e, row) {
			return row.isResolvedIcon
		}
	},
]}
export const subAddCol = (num) => { return [
	{
		title: `子域名上线(${num})`,
		dataIndex: 'affects',
		key: 'affects'
	},
	{
		title: '状态',
		dataIndex: 'isResolved',
		key: 'isResolved',
		filters: [
      {
        text: '已确认',
        value: true,
      },
      {
        text: '待确认',
        value: false,
      },
    ],
		filterMultiple: false,
		filterIcon: <Icon type='down' />,
    onFilter: (value, record) => record.isResolved === value,
		render (e, row) {
			return row.isResolvedIcon
		}
	},
]}
export const subRemoveCol = (num) => { return [
	{
		title: `子域名下线(${num})`,
		dataIndex: 'affects',
		key: 'affects'
	},
	{
		title: '状态',
		dataIndex: 'isResolved',
		key: 'isResolved',
		filters: [
      {
        text: '已确认',
        value: true,
      },
      {
        text: '待确认',
        value: false,
      },
    ],
		filterMultiple: false,
		filterIcon: <Icon type='down' />,
    onFilter: (value, record) => record.isResolved === value,
		render (e, row) {
			return row.isResolvedIcon
		}
	},
]}
